* {box-sizing: border-box;font-family: 'Quicksand', sans-serif ;}
.no-select{
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}
body{background-color:#2f3238;margin: 0px 0px 0px 0px;}
.meta{display:flex;}
.cont{margin-left:50px;}
.graphCont{width:60%; height:600px;margin-left:50px;}
.colors{width:80px; height:600px;margin-left:0.5%;}
.x,.y{stroke:rgba(255,255,255,0.3);}
circle{stroke:white;shape-rendering:geometricalPrecision;}
circle:hover{fill-opacity:1;stroke-width:2px;}
text{font-size:12px;}
.title{color:white;margin-left:0px;display:flex;}
.dropDownCont{position:relative;margin-left:5px;margin-right:5px;cursor:pointer;}
.dropDownCont:hover .dropDownItem{display:block;}
.dropDownItem{cursor:pointer;position:absolute;display:none;}
.dropDownItem>p{height:4px;}
/*.selected{display:"";position:static;}*/
table{width:180px;background-color: rgba(255,255,255,0.2);color: rgba(255,255,255,0.7);}
table tr:hover { color: rgba(255,255,255,1);}
.topblueline{background:linear-gradient(to bottom,rgba(255, 255,255,0.01),rgba(255, 255,255,0.2) 0%,rgba(255, 255,255,0.01));box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.8), 0 -1px 2px 0 rgba(0, 0, 0, 0.9);position:absolute;height:4px;top:40px;width:100%;z-index:2;}
.rowsCont{width:100%;display:flex;display: -webkit-flex;flex-direction: column;-webkit-flex-direction: column;margin-left:4px;z-index:2;}
.bannertext{color:white;text-align:center;margin-top:-2px;z-index:3;white-space: nowrap}
.bannertext>span{font-size:34px;letter-spacing:-1px;}
.banner{color:white;width:100%;z-index:1;display:flex;display: -webkit-flex;}
.row1{display:-webkit-flex;display:flex;height:36px; justify-content: space-between;width:100%;}
#logo {width: 80px;height:80px ;z-index:3;margin-top:4px;flex-shrink:0;margin-right:10px;}
#logo>img{height:;width:100%;margin-left:6px;margin-top:0px; border-radius: 50%; }
.metabox{display: -webkit-flex;display: flex;flex-direction: column;-webkit-flex-direction: column;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;-webkit-flex-wrap: wrap;flex-wrap: wrap;margin-left:12px;margin-right:12px;}
.squared {
	width: 20px;
	height:20px;	
	margin-right: 2px ;
	position: relative;
}
.squared label {
	cursor: pointer;
	position: absolute;
	width: 16px;
	height: 16px;
	top: 0;
	border-radius: 3px;
	border:solid 1px silver;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,.4);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,.4);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,.4);

	background: -webkit-linear-gradient(to top, #222 0%, #45484d 100%);
	background: -moz-linear-gradient(to top, #222 0%, #45484d 100%);
	background: -o-linear-gradient(to top, #222 0%, #45484d 100%);
	background: -ms-linear-gradient(to top, #222 0%, #45484d 100%);
	background: linear-gradient(to top, #222 0%, #45484d 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222', endColorstr='#45484d',GradientType=0 );
}

.squared label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	content: '';
	position: absolute;
	width: 7px;
	height: 5px;
	background: transparent;
	top: 2px;
	left: 3px;
	border: 3px solid #fcfff4;
	border-top: none;
	border-right: none;

	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.squared label:hover::after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
	filter: alpha(opacity=30);
	opacity: 0.3;
}

.squared input[type=checkbox]:checked + label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}
.controls{display:flex;margin-left:100px;}
.controlbox{display:flex;}
.controlbox>span{color:white;margin-top:-2px;}
.myTEXT{
position:fixed;
width:800px;
 font-size: 50px;
 color: rgba(255,255,255,0.8);
--ms-transform: rotate(90deg) translate(-80px,-350px);
-webkit-transform: rotate(90deg) translate(-80px,-350px);
   transform: rotate(-90deg) translate(-80px,-350px);
   letter-spacing:-4px;
   text-shadow:2px 2px 2px gray;
   animation-name: textMove;
  animation-duration: 0.5s;
  animation-timing-function: ease-out;
}
@keyframes textMove {
  from {left:-100px;}
  to {left: 0px;}
}